<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Cache-Control"  content="no-transform">
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>我的订单</title>
    <link href="/statics/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="/statics/view/css/all.css" rel="stylesheet" type="text/css" />
</head>
<body>
[#include "/common/header.ftl" /]
<div class="container">
    <div class="row" style="margin-bottom: 80px;">
        <h3>我的订单</h3>
        <form class="form-inline" id="listForm" style="display: none;">
            <input id="pageNumber" name="pageNumber" value="${pageNumber}" type="hidden" />
            <input type="hidden" id="pageSize" name="numPerPage" value="${page.numPerPage}" />
        </form>
        [#if page.content??]
            [#list page.content as order]
            <div class="panel si-panel-order">
                <div class="panel-heading">
                    订单号:${order.sn} &nbsp;&nbsp; ${order.createDate?string("yy/MM/dd HH:mm")}
                    <div class="order-status">
                        [#if order.orderStatus == "completed"]
                            已完成
                            [#if order.shippingStatus=='returned'](出单失败)
                            [#elseif order.shippingStatus=='received'](出单成功)
                            [/#if]
                        [#elseif order.paymentStatus == "cancelled" ]
                            已取消
                        [#elseif order.paymentStatus == "unpaid"]
                            未支付
                            [#if order.shippingStatus != "unshipped"]
                            ${message("保单状态." + order.shippingStatus)}
                            [/#if]
                        [#else]
                            [#if order.paymentStatus == "paid" && order.shippingStatus == "unshipped"]
                                已支付-等待出单
                            [#elseif order.paymentStatus == "paid" && order.shippingStatus == "shipped"]
                                出单中
                            [#elseif order.paymentStatus == "paid" && order.shippingStatus == "returned"]
                                出单失败
                            [/#if]
                        [/#if]
                    </div>
                </div>
                <div class="panel-body">
                    <div class="table-responsive">
                        <table class="table table-bordered table-striped">
                            <colgroup>
                                <col class="col-xs-2">
                                <col class="col-xs-4">
                                <col class="col-xs-2">
                                <tbody>
                                    [#list order.orderItems as orderItem]
                                    <tr>
                                        <th scope="row">
                                            <code>商品名称</code>
                                        </th>
                                        <td>数量</td>
                                        <td>金额</td>
                                    </tr>
                                    <tr>
                                        <th scope="row">
                                            <code>${orderItem.name}</code>
                                        </th>
                                        <td>1</td>
                                        <td>${orderItem.price}</td>
                                    </tr>
                                    [/#list]
                                </tbody>
                        </table>
                    </div>
                </div>
                <div class="panel-footer">
                    <span><i>¥</i>${order.amount}</span>
                    [#if order.orderStatus == "completed"]
                        [#if order.shippingStatus=='received']<a href="#" class="btn btn-primary btn-handle">评价</a>[/#if]
                    [#elseif order.paymentStatus == "cancelled"]
                    [#elseif order.orderStatus == "confirmed"&& order.paymentStatus == "unpaid"]
                        <a href="/member/order/payment?orderId=${order.id}" class="btn btn-primary btn-handle">马上支付</a>
                        [#if order.shippingStatus == "unshipped"]
                        [#--<a href="/member/order/payment?orderId=${order.id}" class="btn btn-primary btn-handle">取消订单</a>--]
                        [/#if]
                    [#else]
                        [#if order.paymentStatus == "paid" && order.shippingStatus == "unshipped"]

                        [#elseif order.paymentStatus == "paid" && order.shippingStatus == "shipped"]

                        [#elseif order.paymentStatus == "paid" && order.shippingStatus == "returned"]

                        [/#if]
                    [/#if]

                    <a href="/member/order/view?orderId=${order.id}" class="btn btn-primary btn-handle">查看详情</a>
                </div>
            </div>
            [/#list]
            [@pagination pageNumber = page.pageNumber totalPages = page.totalPages]
                [#include "/common/wap_pagination.ftl"]
            [/@pagination]
            [#else]
                <div class="alert alert-info" role="alert">暂无订单记录！</div>
        [/#if]

    </div>
</div>

<script type="text/javascript" src="/statics/jquery/jquery.js"></script>
<script type="text/javascript" src="/statics/view/js/common.js"></script>
</body>
</html>